import { Outlet } from 'react-router-dom'
import { AliveScope } from 'react-activation'
import {
  ViewListIcon, AppIcon, SystemCoordinateIcon, CooperateIcon, GestureUpIcon,
  BugIcon, BookOpenIcon, ChartLineData1Icon, LayersIcon,
  DataBaseIcon, GitMergeIcon, TaskIcon
} from 'tdesign-icons-react'
import SideBar from '@/components/SideBar'
import styles from './app.module.less'

const App = () => {

  const menuList: SideBarMenuListType = [
    {
      title: '首页',
      icon: <AppIcon />,
      value: 'home',
      isTailNode: true
    },
    {
      title: '项目',
      icon: <SystemCoordinateIcon />,
      value: 'project',
      children: [
        {
          title: '项目列表',
          icon: <BookOpenIcon />,
          value: 'project/project-list',
          isTailNode: true
        },
        {
          title: '模块列表',
          icon: <LayersIcon />,
          value: 'project/module-list',
          isTailNode: true
        }
      ]
    },
    {
      title: '组织',
      icon: <CooperateIcon />,
      value: 'organization',
      children: [
        {
          title: '用户树',
          icon: <GestureUpIcon />,
          value: 'organization/user-tree',
          isTailNode: true
        },
        {
          title: '创建用户',
          icon: <BugIcon />,
          value: 'organization/create-user',
          isTailNode: true
        }
      ]
    },
    {
      title: '测试',
      icon: <SystemCoordinateIcon />,
      value: 'test',
      children: [
        {
          title: '查看bug',
          icon: <ChartLineData1Icon />,
          value: 'test/show-bugs',
          isTailNode: true
        },
        {
          title: '创建bug',
          icon: <BugIcon />,
          value: 'test/create-bug',
          isTailNode: true
        }
      ]
    },
    {
      title: '系统配置',
      icon: <SystemCoordinateIcon />,
      value: 'system',
      children: [
        {
          title: '字典管理',
          icon: <BookOpenIcon />,
          value: 'system/dictionary',
          children: [
            {
              title: '查看字典',
              value: 'system/dictionary/dictionary-table',
              isTailNode: true
            },
            {
              title: '添加字典',
              value: 'system/dictionary/add-dictionary',
              isTailNode: true
            }
          ]
        },
        {
          title: '数据库管理',
          icon: <DataBaseIcon />,
          value: 'system/database/database-list',
          isTailNode: true
        }
      ]
    },
    {
      title: '执行',
      icon: <ViewListIcon />,
      value: 'performance',
      isTailNode: true
    },
    {
      title: 'DevOps',
      icon: <GitMergeIcon />,
      value: 'devops',
      isTailNode: true
    },
    {
      title: '文档',
      icon: <TaskIcon />,
      value: 'document',
      isTailNode: true
    },
    {
      title: '统计',
      icon: <LayersIcon />,
      value: 'statistics',
      isTailNode: true
    },
  ]

  return <div className={'app'}>
    <SideBar currentAppRouteKey='bug-manager' menuList={menuList} />
    {/* // 这个侧边栏就是右边的子页面的显示区域 */}
    <div className={'content'}>
      <Outlet />
    </div>
  </div>
}

export default App
